<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"  %> 
<%@ taglib prefix="c"   uri="http://java.sun.com/jsp/jstl/core" %>
 <html>
  <head>
	<title></title>
	<style type="text/css">
	 
		table {
			margin: auto;
			width: 100%;
			border-collapse: collapse;
			border: 1px solid #444444;
		}
		
		th,td {
			border: 1px solid #444444;
			font-size: 10px;
			margin-left: 5px;
		}
    	html, body {
			font-family: Arial Unicode MS;
			font-size: 10px;
		    font-size: 14px;
           	background-color: #f1f1f1;
	    }
	    .left{
	    	float: left;
	    }
	    .clearfix:before,.clearfix:after{ 
		    content:""; 
		    display:table; 
		} 
		.clearfix:after{clear:both;} 
		.clearfix{ 
		    *zoom:1;/*IE/7/6*/
		}
    	.co-head{
		    background-color: #fff;
		    margin: 15px;
		    padding: 5px 0 20px;
		    text-align: center;
		    position: relative;
		}
		.co-headTop{
			height: 70px;
		    position: relative;
		}
		.co-headCol{
			display: inline-block;
			text-align: left;
		}
		.co-headTitle{
			font-size: 22px;
		    border-right: 3px solid #1EB5AD;
		    padding: 5px 30px 5px 0;
		    margin: 15px 15px 15px 0;
		}
		.co-carType{
		    position: relative;
		    top: 2px;
		}
		.co-carName{
			position: relative;
		    top: 8px;
		}
		.co-headCount{
		    display: inline-block;
		    width: 350px;
		    height: 30px;
		    line-height: 30px;
		    border: 1px solid #1EB5AD;
		    border-radius: 5px;
		    cursor: pointer;
		}
		
		.co-content{
			background-color: #fff;
			padding: 15px;
			margin: 15px;
		}
		.pl-contentTitle{
			margin-bottom: 15px;
		}
		.pl-contentTitle div{
			display: inline-block;
			vertical-align: middle;
		}
		.pl-titleTag{
		    width: 15px;
		    height: 15px;
		    background-color: #1EB5AD;
		    border-radius: 50%;
		}
		.pl-titleName{
			font-weight: bold;
			font-size: 16px;
			width: 80px;
		}
		.pl-titleCount{
		    background-color: #1EB5AD;
		    color: #fff;
		    padding: 2px 18px;
		    margin-left: 30px;
		    font-size: 14px;
		    border-radius: 5px;
		}
		.pl-titleCount div:not(:last-child){
			border-right: 1px solid rgba(255,255,255,0.6);
		    padding-right: 10px;
		}
		.pl-titleCount div:not(:first-child){
		    padding-left: 10px;
		}
		
		.co-contentList table{
			width: 100%;
		    border: 1px solid #ddd;
		    border-spacing: 0;
		    border-collapse: collapse;
		}
		.co-contentList tr{
			height: 38px;
    		line-height: 38px;
    		text-align: center;
			vertical-align: middle;
		}
		.table>tbody>tr:hover{
			background-color: #f1f1f1;
			cursor: pointer;
		}
		.co-contentList thead{
			background-color: #ECEAEA;
		}
		.table>thead>tr>th {
		    border-bottom: 2px solid #ddd;
		}
		.table>tbody>tr:not(:last-child) {
		    border-bottom: 1px solid #ddd;
		}
		.table>tbody>tr>td:not(:last-child),
		.table>thead>tr>th:not(:last-child){
		    border-right: 1px solid #ddd;
		}
    </style>
  </head>
  
  <body>
    <div class="load-body">
  		<div class="co-head">
			<div class="co-headTop">
	  					<div class="co-headCol co-headTitle">零件清单</div>
	  					<div class="co-headCol">
							<div class="co-carType">型号：<span>${partListDesignModel.cartype}</span></div>
							<div class="co-carName">${partListDesignModel.alias}</div>
						</div>
			</div>
			<div class="co-headCount">造价总计：￥${partListDesignModel.totalprice/100}</div>
		</div>
 
  		
 
  		        <c:forEach var="valueMap" items="${partListDesignModel.valueList}" varStatus="vs">
  		          <div class="co-content">
	  		        	<div class="clearfix">
				  			<div class="pl-contentTitle left ">
				  				<div class="pl-titleTag"></div>
				  				<div class="pl-titleName">${valueMap.partsTypeName}</div>
				  				<div class="pl-titleCount">
				  					<div>总价：￥${valueMap.sum/100}</div>
				  					<div>项目：${fn:length(valueMap.list)}</div>
				  				</div>
				  			</div>
			  			</div>
  		        
		  				<table class="table table-bordered table-hover">
					      <thead>
					        <tr>
					          <th>零件号 </th>
					          <th>零件名 </th>
					          <th>材料    </th>
					          <th>数量(件) </th>
					          <th>单价(元/件) </th>
					          <th>供应商 </th>
					          <th>备注 </th>
					        </tr>
					      </thead>
					      <tbody>
					       <c:forEach var="parts" items="${valueMap.list}">
						        <tr>
						          <td>${parts.partsno}</td>
						          <td>${parts.partsname}</td>
						          <td>${parts.material}</td>
						          <td>${parts.num}</td>
						          <td>${parts.price/100}</td>
						          <td>${parts.provider}</td>
						          <td>${parts.comment}</td>
						        </tr>
                                </c:forEach>
					      </tbody>
					    </table>
 
  		       </div><!-- co-content-->
  			</c:forEach>
  		</div><!-- load-body -->
		
	 
  </body>
</html>
